<template>
    <div id="app">
        <el-progress :text-inside="true" :stroke-width="18" :percentage="schedule"></el-progress>
    </div>
</template>

<script lang="ts">
const { ipcRenderer } = require("electron");
import { Component, Vue, Emit } from "vue-property-decorator";
import { setTimeout } from "timers";

@Component({
    components: {}
})
export default class Home extends Vue {
    // 向父组件传的值
    @Emit("isShowUpdate") sendMessage(val?: boolean) {}

    // 进度
    private schedule: number = 0;

    // 生命周期
    private created() {
        ipcRenderer.on(
            "message",
            (event: any, { message, data }: { message: any; data: any }) => {
                // 进度条
                if (message === "downloadProgress") {
                    this.schedule = data.percent.toFixed(2);
                } else if (message === "update-not-available") {
                    this.isShowUpdate(false);
                } else if (message === "isUpdateNow") {
                    // 现在下载
                    ipcRenderer.send("updateNow");
                } else if (message === "error") {
                    alert("更新失败！");
                }
            }
        );
    }

    // 生命周期
    private mounted() {
        ipcRenderer.send("update");
    }

    // 向父组件传的值
    private isShowUpdate(data: boolean) {
        this.sendMessage(data);
    }
}
</script>


<style>
/* CSS */
</style>